<!--@ 用户信息-->
<template>
	<view class="padding-bottom-xl">
		<load-flex :loading="loading"></load-flex>
		<u-notify ref="uNotify" />
		<!-- 表单部分 -->
		<view class="text-black padding-bottom">
			<u-collapse :border="false" :accordion="false" :value="activeNames" :key="time">
				<uni-forms ref="valiForm" labelWidth="375px" label-position="top">
					<uni-card :is-shadow="false" style="padding:0 !important" margin="1" padding='0'
						v-if="dataSource && dataSource.length>0" v-for="(item,index) in dataSource"
						:class="indexCardInfo >index?'':'pagesss'">
						<template v-slot:title>
							<u-collapse-item name="1">
								<view slot="title" class="flex align-center">
									<view class="padding-right-sm">
										<u-badge type="success" max="99999" :value="index+1"></u-badge>
									</view>
									<view class="text-df">
										{{item.cardName?`${item.cardName?`${item.cardName}-(${item.totalDebt})`:''}`:`请点击展开录入第${index+1}信用卡信息`}}
									</view>
								</view>
								<view slot="value" v-if="!item.id" class="cu-btn round sm bg-red"
									@click="handDel(index)">删除</view>
								<!-- <u-divider v-if="dataSource.length == 1 || indexCardInfo >index "
									:text="`第${index+1}条信用卡信息`" :dashed="true"></u-divider>
								<u-divider v-else " textColor="#013E8E"
									:text="`第${index +1}条信用卡信息       点击删除本条信用卡信息`" /> -->
								<uni-forms-item label="信用卡欠款银行名称" required>
									<uni-easyinput :disabled="indexCardInfo >index"
										:errorMessage="!item.cardName&&verify?true:false" v-model="item.cardName"
										placeholder="请输入信用卡欠款银行名称" />
								</uni-forms-item>
								<uni-forms-item label="办卡方式" required>
									<uni-data-checkbox :disabled="indexCardInfo >index" mode="button"
										:errorMessage="!item.applicateCardMethod&&verify?true:false"
										v-model="item.applicateCardMethod" :localdata="sexArr"></uni-data-checkbox>
								</uni-forms-item>
								<uni-forms-item label="信用卡卡号" required>
									<uni-easyinput v-model="item.cardBar" :disabled="indexCardInfo >index" type="number"
										:maxlength="30" :errorMessage="!item.cardBar&&verify?true:false"
										placeholder="请输入信用卡卡号" />
								</uni-forms-item>
								<uni-forms-item label="逾期多久了(具体逾期时间)">
									<view @click="handCheck(4,index)">
										<uni-easyinput disabled v-model="item.overdueTime"
											placeholder="请输入逾期多天了,从什么时候开始的" />
									</view>
								</uni-forms-item>
								<uni-forms-item label="信用卡包含利息总欠款" required>
									<uni-easyinput :disabled="indexCardInfo >index"
										:errorMessage="!item.totalDebt&&verify?true:false" v-model="item.totalDebt"
										placeholder="请输入信用卡包含利息总欠款" type="number" :maxlength="8" />
								</uni-forms-item>
								<uni-forms-item label="目前额度" required>
									<uni-easyinput :disabled="indexCardInfo >index"
										:errorMessage="!item.carLimit&&verify?true:false" v-model="item.carLimit"
										placeholder="请输入目前额度" type="number" :maxlength="8" />
								</uni-forms-item>
								<uni-forms-item label="审批原始额度" required>
									<uni-easyinput :disabled="indexCardInfo >index" v-model="item.originalCreditLimit"
										type="number" :maxlength="8" placeholder="请输入审批原始额度" />
								</uni-forms-item>
								<uni-forms-item label="备用金额度(没有可以不用填写)">
									<uni-easyinput :disabled="indexCardInfo >index" v-model="item.reserveFunds"
										placeholder="请输入备用金额度" type="number" :maxlength="8" />
								</uni-forms-item>
								<uni-forms-item label="办卡时邮箱" required>
									<uni-easyinput :disabled="indexCardInfo >index"
										:errorMessage="!item.applicateCardEmail&&verify?true:false"
										v-model="item.applicateCardEmail" placeholder="请输入办卡时邮箱" />
								</uni-forms-item>
								<uni-forms-item label="银行初始预留手机号" required>
									<uni-easyinput :disabled="indexCardInfo >index"
										:errorMessage="!item.reservedBankInitPhone&&verify?true:false"
										v-model="item.reservedBankInitPhone" type="number" :maxlength="11"
										placeholder="请输入银行初始预留手机号" />
								</uni-forms-item>
								<uni-forms-item label="查询密码">
									<uni-easyinput :disabled="indexCardInfo >index" v-model="item.queryPassword"
										placeholder="请输入查询密码" type="number" :maxlength="6" />
								</uni-forms-item>
								<uni-forms-item label="还款储蓄卡绑定哪家银行" required>
									<uni-easyinput :disabled="indexCardInfo >index"
										:errorMessage="!item.repaymentBindingBank&&verify?true:false"
										v-model="item.repaymentBindingBank" placeholder="请输入还款储蓄卡绑定哪家银行" />
								</uni-forms-item>
								<uni-forms-item label="绑定还款卡号" required>
									<uni-easyinput :disabled="indexCardInfo >index"
										:errorMessage="!item.repaymentBindingBankCard&&verify?true:false"
										v-model="item.repaymentBindingBankCard" type="number" :maxlength="30"
										placeholder="请输入绑定还款卡号" />
								</uni-forms-item>
								<uni-forms-item label="分了多少期">
									<uni-easyinput :disabled="indexCardInfo >index" v-model="item.byStages"
										placeholder="请输入分了多少期" type="number" :maxlength="3" />
								</uni-forms-item>
								<uni-forms-item label="月还款金额是多少">
									<uni-easyinput :disabled="indexCardInfo >index"
										v-model="item.monthlyRepaymentAmount" placeholder="请输入月还款金额是多少" type="number"
										:maxlength="8" />
								</uni-forms-item>
								<view @click="handCheck(1,index)">
									<uni-forms-item label="账单日" required>
										<uni-easyinput disabled :errorMessage="!item.billingDate&&verify?true:false"
											v-model="item.billingDate" placeholder="请选择账单日" />
									</uni-forms-item>
								</view>
								<view @click="handCheck(2,index)">
									<uni-forms-item label="还款日" required>
										<uni-easyinput disabled :errorMessage="!item.repaymentDate&&verify?true:false"
											v-model="item.repaymentDate" placeholder="请选择还款日" />
									</uni-forms-item>
								</view>

								<view @click="handCheck(3,index)">
									<uni-forms-item label="本次到期还款日" required>
										<uni-easyinput disabled
											:errorMessage="!item.currentRepaymentDate&&verify?true:false"
											v-model="item.currentRepaymentDate" placeholder="请选择本次到期还款日" />
									</uni-forms-item>
								</view>
								<uni-forms-item label="计划还款周期" required>
									<uni-easyinput :disabled="indexCardInfo >index"
										:errorMessage="!item.planRepaymentCycle&&verify?true:false" type="textarea"
										v-model="item.planRepaymentCycle"
										placeholder="请输入打算多久结清欠款或计划每个月拿出多少自己去偿还此笔款项？"></uni-easyinput>
								</uni-forms-item>
								<uni-forms-item label="逾期真实原因" required>
									<uni-easyinput :disabled="indexCardInfo >index"
										:errorMessage="!item.expectedRealReasons&&verify?true:false" type="textarea"
										v-model="item.expectedRealReasons" placeholder="请输入逾期真实原因" />
								</uni-forms-item>
								<text class="text-red text-sm">*如委托者信用卡的单位和紧急联系人信息都一样，以下内容登记无需重复填写！</text>
								<uni-forms-item label="办卡预留单位名称">
									<uni-easyinput :disabled="indexCardInfo >index" v-model="item.reservedJobName"
										placeholder="请输入办卡预留单位名称" />
								</uni-forms-item>
								<uni-forms-item label="办卡预留单位详细细地址">
									<uni-easyinput :disabled="indexCardInfo >index" v-model="item.reservedJobAddress"
										placeholder="请输入办卡预留单位详细细地址" />
								</uni-forms-item>

								<uni-forms-item label="紧急联系人姓名(1)">
									<uni-easyinput :disabled="indexCardInfo >index"
										v-model="item.emergencyContactNameOne" placeholder="请输入紧急联系人姓名" />
								</uni-forms-item>
								<uni-forms-item label="紧急联系人电话(1)">
									<uni-easyinput :disabled="indexCardInfo >index"
										v-model="item.emergencyContactPhoneOne" type="number" :maxlength="11"
										placeholder="请输入紧急联系人电话" />
								</uni-forms-item>
								<uni-forms-item label="紧急联系人关系(1)">
									<uni-easyinput :disabled="indexCardInfo >index"
										v-model="item.emergencyContactRelationshipOne" placeholder="请输入紧急联系人关系" />
								</uni-forms-item>
								<uni-forms-item label="紧急联系人姓名(2)">
									<uni-easyinput :disabled="indexCardInfo >index"
										v-model="item.emergencyContactNameTwo" placeholder="请输入紧急联系人姓名" />
								</uni-forms-item>
								<uni-forms-item label="紧急联系人电话(2)">
									<uni-easyinput :disabled="indexCardInfo >index"
										v-model="item.emergencyContactPhoneTwo" type="number" :maxlength="11"
										placeholder="请输入紧急联系人电话" />
								</uni-forms-item>
								<uni-forms-item label="紧急联系人关系(2)">
									<uni-easyinput :disabled="indexCardInfo >index"
										v-model="item.emergencyContactRelationshipTwo" placeholder="请输入紧急联系人关系" />
								</uni-forms-item>
							</u-collapse-item>
						</template>
						<view slot="actions" class="card-actions" v-if="!stagingShow && dataSource.length == index+1">
							<view class="card-actions-item" @click="hanstagingShow()">
								<uni-icons type="map" size="18" color="blue"></uni-icons>
								<text class="card-actions-item-text " style="color:blue">新增信用卡信息</text>
							</view>
						</view>
					</uni-card>
				</uni-forms>
			</u-collapse>
		</view>
		<view class="card-actions" @click="hanstagingShow(1)"
			v-if="stagingShow && dataSource.length == 0 && stagingMode.applicateCardMethod == undefined">
			<view class="card-actions-item">
				<uni-icons type="map" size="18" color="blue"></uni-icons>
				<text class="card-actions-item-text " style="color:blue">新增信用卡信息</text>
			</view>
		</view>
		<view style="padding-bottom: 100rpx;" class="box"
			v-if="stagingShow && stagingMode.applicateCardMethod !=undefined">
			<uni-card :is-shadow="false" style="padding:0 !important" margin="1" padding='1'>
				<template v-slot:title>
					<!-- <view class="flex align-center padding-sm">
						<view class="padding-right-sm">
							<u-badge type="error" max="99999" :value="1"></u-badge>
						</view>
						<view class="text-df text-black">
							填写贷款信息,(点击保存本条信用卡信息）
						</view>
					</view> -->
					<view class="flex align-center justify-between padding-sm">
						<view class="flex align-center">
							<view class="padding-right-sm">
								<u-badge type="success" max="99999"
									:value="dataSource.length>0?dataSource.length+1:1"></u-badge>
							</view>
							<view class="text-df text-black">
								填写信用卡信息,(点击保存信息）
							</view>
						</view>
						<view class="cu-btn round sm bg-red sm" @click="handeDelStagin()">
							{{`删除`}}
						</view>
						<view class="cu-btn round sm bg-blue sm" @click="handAdd()">{{`保存`}}</view>
					</view>
				</template>
				<uni-forms ref="valiForm" :rules="rulesFrom" :modelValue="stagingMode" labelWidth="375px"
					label-position="top">
					<uni-forms-item label="信用卡欠款银行名称" required name="cardName">
						<uni-easyinput v-model="stagingMode.cardName" placeholder="请输入信用卡欠款银行名称" />
					</uni-forms-item>

					<uni-forms-item label="信用卡卡号" required name="cardBar">
						<uni-easyinput v-model="stagingMode.cardBar" type="number" :maxlength="30"
							placeholder="请输入信用卡卡号" @blur="handleBlur" />
					</uni-forms-item>
					<uni-forms-item label="绑定还款卡号" required name="repaymentBindingBankCard">
						<uni-easyinput v-model="stagingMode.repaymentBindingBankCard" type="number" :maxlength="30"
							placeholder="请输入绑定还款卡号" />
					</uni-forms-item>
					<uni-forms-item label="信用卡包含利息总欠款" required name="totalDebt">
						<uni-easyinput placeholder="请输入信用卡包含利息总欠款" v-model="stagingMode.totalDebt" type="number"
							:maxlength="8" />
					</uni-forms-item>
					<uni-forms-item label="办卡方式" required name="applicateCardMethod">
						<uni-data-checkbox mode="button" v-model="stagingMode.applicateCardMethod"
							:localdata="sexArr"></uni-data-checkbox>
					</uni-forms-item>
					<uni-forms-item label="逾期多久了(具体逾期时间)">
						<view @click="handStaging(4)">
							<uni-easyinput disabled style="pointer-events: none; background-color: white !important;"
								v-model="stagingMode.overdueTime" placeholder="请输入逾期多天了,从什么时候开始的" />
						</view>
					</uni-forms-item>
					<uni-forms-item label="目前额度" required name="carLimit">
						<uni-easyinput placeholder="请输入目前额度" type="number" :maxlength="8"
							v-model="stagingMode.carLimit" />
					</uni-forms-item>
					<uni-forms-item label="审批原始额度" required>
						<uni-easyinput v-model="stagingMode.originalCreditLimit" type="number" :maxlength="8"
							placeholder="请输入审批原始额度" />
					</uni-forms-item>
					<uni-forms-item label="备用金额度(没有可以不用填写)">
						<uni-easyinput placeholder="请输入备用金额度" type="number" :maxlength="8"
							v-model="stagingMode.reserveFunds" />
					</uni-forms-item>
					<uni-forms-item label="办卡时邮箱" required name="applicateCardEmail">
						<uni-easyinput v-model="stagingMode.applicateCardEmail" placeholder="请输入办卡时邮箱" />
					</uni-forms-item>

					<uni-forms-item label="银行初始预留手机号" required name="reservedBankInitPhone">
						<uni-easyinput v-model="stagingMode.reservedBankInitPhone" type="number" :maxlength="11"
							placeholder="请输入银行初始预留手机号" />
					</uni-forms-item>
				<!-- 	<uni-forms-item label="交易密码">
						<uni-easyinput :disabled="indexCardInfo >index" v-model="item.transactionPassword"
							placeholder="请输入交易密码" type="number" :maxlength="6" />
					</uni-forms-item>-->
					<uni-forms-item label="查询密码">
						<uni-easyinput v-model="stagingMode.queryPassword" placeholder="请输入查询密码" type="number"
							:maxlength="6" />
					</uni-forms-item> 

					<uni-forms-item label="还款储蓄卡绑定哪家银行" required name="repaymentBindingBank">
						<uni-easyinput v-model="stagingMode.repaymentBindingBank" placeholder="请输入还款储蓄卡绑定哪家银行" />
					</uni-forms-item>


					<uni-forms-item label="分了多少期">
						<uni-easyinput v-model="stagingMode.byStages" placeholder="请输入分了多少期" type="number"
							:maxlength="3" />
					</uni-forms-item>

					<uni-forms-item label="月还款金额是多少">
						<uni-easyinput v-model="stagingMode.monthlyRepaymentAmount" placeholder="请输入月还款金额是多少"
							type="number" :maxlength="8" />
					</uni-forms-item>
					<view @click="handStaging(1)">
						<uni-forms-item label="账单日" required>
							<uni-easyinput disabled style="pointer-events: none;background-color: #fff;"
								v-model="stagingMode.billingDate" placeholder="请选择账单日" />
						</uni-forms-item>
					</view>
					<view @click="handStaging(2)">
						<uni-forms-item label="还款日" required name="repaymentDate">
							<uni-easyinput disabled style="pointer-events: none;background-color: #fff;"
								v-model="stagingMode.repaymentDate" placeholder="请选择还款日" />
						</uni-forms-item>
					</view>

					<view @click="handStaging(3)">
						<uni-forms-item label="本次到期还款日" required>
							<uni-easyinput disabled style="pointer-events: none;background-color: #fff"
								v-model="stagingMode.currentRepaymentDate" placeholder="请选择本次到期还款日" />
						</uni-forms-item>
					</view>
					<uni-forms-item label="计划还款周期" required name="planRepaymentCycle">
						<uni-easyinput type="textarea" v-model="stagingMode.planRepaymentCycle"
							placeholder="请输入打算多久结清欠款或计划每个月拿出多少自己去偿还此笔款项？" />
					</uni-forms-item>
					<uni-forms-item label="逾期真实原因" required name="expectedRealReasons">
						<uni-easyinput type="textarea" v-model="stagingMode.expectedRealReasons"
							placeholder="请输入逾期真实原因" />
					</uni-forms-item>
					<text class="text-red text-sm">*如委托者信用卡的单位和紧急联系人信息都一样，以下内容登记无需重复填写！</text>
					<uni-forms-item label="办卡预留单位名称">
						<uni-easyinput v-model="stagingMode.reservedJobName" placeholder="请输入办卡预留单位名称" />
					</uni-forms-item>
					<uni-forms-item label="办卡预留单位详细细地址">
						<uni-easyinput v-model="stagingMode.reservedJobAddress" placeholder="请输入办卡预留单位详细细地址" />
					</uni-forms-item>
					<uni-forms-item label="紧急联系人姓名(1)">
						<uni-easyinput v-model="stagingMode.emergencyContactNameOne" placeholder="请输入紧急联系人姓名" />
					</uni-forms-item>
					<uni-forms-item label="紧急联系人电话(1)">
						<uni-easyinput v-model="stagingMode.emergencyContactPhoneOne" type="number" :maxlength="11"
							placeholder="请输入紧急联系人电话" />
					</uni-forms-item>
					<uni-forms-item label="紧急联系人关系(1)">
						<uni-easyinput v-model="stagingMode.emergencyContactRelationshipOne" placeholder="请输入紧急联系人关系" />
					</uni-forms-item>
					<uni-forms-item label="紧急联系人姓名(2)">
						<uni-easyinput v-model="stagingMode.emergencyContactNameTwo" placeholder="请输入紧急联系人姓名" />
					</uni-forms-item>
					<uni-forms-item label="紧急联系人电话(2)">
						<uni-easyinput v-model="stagingMode.emergencyContactPhoneTwo" type="number" :maxlength="11"
							placeholder="请输入紧急联系人电话" />
					</uni-forms-item>
					<uni-forms-item label="紧急联系人关系(2)">
						<uni-easyinput v-model="stagingMode.emergencyContactRelationshipTwo" placeholder="请输入紧急联系人关系" />
					</uni-forms-item>
				</uni-forms>
				<view slot="actions" class="card-actions">
					<view class="card-actions-item" v-if="dataSource.length>0" @click="handeDelStagin()">
						<uni-icons type="trash" size="18" color="red"></uni-icons>
						<text class="card-actions-item-text " style="color:red">{{`删除`}}</text>
					</view>
					<view class="card-actions-item" @click="handAdd()">
						<uni-icons type="map" size="18" color="blue"></uni-icons>
						<text class="card-actions-item-text " style="color:blue">{{`保存信息`}}</text>
					</view>
				</view>
			</uni-card>
		</view>
		<view class="cu-bar bg-white tabbar  border shop"
			style="position: fixed;bottom: 0;left: 0;width: 100%; z-index: 9999;">
			<view class="btn-group justify-between">
				<button class="cu-btn bg-red round shadow-blur" @click="handeLaststep()">返回上一步</button>
				<!-- <button class="cu-btn bg-green round shadow-blur" @click="loadData(1)">无信用卡贷款</button> -->
				<button class="cu-btn bg-tnant3 round shadow-blur" @click="loadData">下一步</button>
			</view>
		</view>
		<uni-calendar ref="calendar" :insert="false" @confirm="ConfirmCheck" />
		<uni-calendar ref="refStaging" :insert="false" @confirm="ConfirmStaging" />
		<TipsModal :uModalShow="uModalShow" :uModalContent="uModalContent" @uModalCle="uModalCle"
			@uModalCom="uModalCom" />
	</view>

</template>
<script>
	import TipsModal from '@/components/TipsModal/TipsModal.vue' //确定窗
	import loadFlex from '@/components/loadFlex/loadFlex.vue' //加载框
	import myApi from '@/utils/app.js' //调用接口使
	export default {
		components: {
			loadFlex,
			TipsModal
		},
		name: 'indexFrom',

		data() {
			return {
				activeNames: [],
				time: '',
				rulesFrom: {
					cardName: {
						rules: [{
							required: true,
							errorMessage: '请输入信用卡欠款银行名称'
						}]
					},

					applicateCardMethod: {
						rules: [{
							required: true,
							errorMessage: '请选择办卡方式'
						}]
					},
					cardBar: {
						rules: [{
							required: true,
							errorMessage: '请输入信用卡卡号'
						}]
					},
					totalDebt: {
						rules: [{
							required: true,
							errorMessage: '请输入信用卡包含利息总欠款'
						}]
					},

					carLimit: {
						rules: [{
							required: true,
							errorMessage: '请输入目前额度'
						}]
					},
					// originalCreditLimit: {
					// 	rules: [{
					// 		required: true,
					// 		errorMessage: '请输入审批原始额度'
					// 	}]
					// },

					applicateCardEmail: {
						rules: [{
							required: true,
							errorMessage: '请输入办卡时邮箱'
						}]
					},
					reservedBankInitPhone: {
						rules: [{
							required: true,
							errorMessage: '请输入银行初始预留手机号'
						}]
					},
					repaymentBindingBank: {
						rules: [{
							required: true,
							errorMessage: '请输入还款储蓄卡绑定哪家银行'
						}]
					},
					repaymentBindingBankCard: {
						rules: [{
							required: true,
							errorMessage: '请输入完整银行卡号'
						}]
					},

					repaymentDate: {
						rules: [{
							required: true,
							errorMessage: '请选择还款日'
						}]
					},
					planRepaymentCycle: {
						rules: [{
							required: true,
							errorMessage: '请输入打算多久结清欠款或计划每个月拿出多少自己去偿还此笔款项'
						}]
					},
					expectedRealReasons: {
						rules: [{
							required: true,
							errorMessage: '请输入逾期真实原因'
						}]
					}

				},
				sexArr: [{
					text: '线上',
					value: '0'
				}, {
					text: '线下',
					value: '1'
				}],
				verify: false,
				dataSource: [],
				model: {},
				indexCardInfo: 0,
				loading: false,
				uModalTart: {}, //确定窗
				uModalShow: false, //确定窗
				uModalContent: '你确定要删除吗？', //确定窗
				stagingMode: {
					applicateCardMethod: undefined
				},
				stagingShow: false,
			}
		},
		props: {
			ageSync: {
				type: Object,
				default: () => {}
			},
			dataPrimitive: {
				type: Object,
				default: () => {}
			}
		},
		watch: {
			ageSync: {
				handler(val) {
					if (val && val.data && val.data.length > 1) {
						this.stagingShow = false
						this.stagingMode = {
							applicateCardMethod: undefined
						}
						this.dataSource = []
						const arr = val.data[1]
						if (arr.length > 1) {
							this.dataSource = val.data[1]
						}
						if (arr.length == 0 || arr.length == 1) {
							this.stagingMode = {
								...arr[0],
								applicateCardMethod: undefined
							}
							this.stagingShow = true
						}
					}
				},
				immediate: true
			},
			dataPrimitive: {
				handler(val) {
					this.indexCardInfo = 0
					if (val && val.formCreditCardInfo && val.formCreditCardInfo.length > 0) {
						this.indexCardInfo = val.formCreditCardInfo.length
						this.dataSource = val.formCreditCardInfo
						if(this.dataSource.length ==0 ) return this.stagingShow = true
						this.stagingShow = false
					}else {
						this.stagingMode = {
							applicateCardMethod: undefined
						}
						this.stagingShow = true
					}
				},
				immediate: true
			},

		},
		methods: {
			onInfrom(item) {
				uni.pageScrollTo({
					scrollTop: 0,
					duration: 0
				});
				if (this.dataSource.length > 0) return this.stagingShow = false
				this.stagingShow = true
				if (this.dataSource.length == 0 && item.emergencyContactNameOne)
					this.$set(this.stagingMode, 'emergencyContactNameOne', item.emergencyContactNameOne)
				if (this.dataSource.length == 0 && item.emergencyContactPhoneOne)
					this.$set(this.stagingMode, 'emergencyContactPhoneOne', item.emergencyContactPhoneOne)
				if (this.dataSource.length == 0 && item.emergencyContactRelationshipOne)
					this.$set(this.stagingMode, 'emergencyContactRelationshipOne', item.emergencyContactRelationshipOne)
				if (this.dataSource.length == 0 && item.emergencyContactNameTwo)
					this.$set(this.stagingMode, 'emergencyContactNameTwo', item.emergencyContactNameTwo)
				if (this.dataSource.length == 0 && item.emergencyContactPhoneTwo)
					this.$set(this.stagingMode, 'emergencyContactPhoneTwo', item.emergencyContactPhoneTwo)
				if (this.dataSource.length == 0 && item.emergencyContactRelationshipTwo)
					this.$set(this.stagingMode, 'emergencyContactRelationshipTwo', item.emergencyContactRelationshipTwo)
				if (this.dataSource.length == 0 && item.currentJobName) this.$set(this.stagingMode,
					'reservedJobName', item.currentJobName)
				if (this.dataSource.length == 0 && item.currentJobAddress) this.$set(this.stagingMode,
					'reservedJobAddress', item.currentJobAddress)
			},
			hanstagingShow(index) { // 新增
				if (index && index == 1) return this.$set(this.stagingMode,
					'applicateCardMethod', '1')
				let obj = {
					...this.dataSource[this.dataSource.length - 1]
				}
				if (obj.id) delete obj.id
				obj.totalDebt = ''
				obj.cardName = ''
				obj.cardBar = ''
				obj.repaymentBindingBankCard = ''
				this.stagingShow = true
				this.stagingMode = {
					...obj
				}
				this.activeNames = []
				this.time = new Date().valueOf()
				uni.pageScrollTo({
					scrollTop: 0,
					duration: 0
				});
				setTimeout(() => (
					this.onValiFrom()), 100);
			},
			onValiFrom() {
				this.$refs.valiForm.validate().then(res => {})
			},
			handeDelStagin() {
				const that = this
				uni.showModal({
					title: '提示',
					content: `确定删除第   ${that.dataSource.length + 1}  条贷款信息吗`,
					success: function(res) {
						console.log(res)
						if (res.confirm) {
							that.stagingMode = {
								applicateCardMethod: undefined
							}
							uni.pageScrollTo({
								scrollTop: 0,
								duration: 0
							});
							that.stagingShow = true
						}

					},
				})
			},
			handAdd(index) { //新增
				this.$refs.valiForm.validate().then(res => {
					let obj = {
						...this.stagingMode
					}
					this.dataSource.push(obj);
					this.stagingMode = {}
					uni.pageScrollTo({
						scrollTop: this.dataSource.length > 10 ? this.dataSource.length * 50 : 0,
						duration: 0
					});
					this.stagingShow = false
				}).catch(err => {
					this.onNotify({
						type: 'error',
						message: err[0].errorMessage,
					});
					uni.pageScrollTo({
						scrollTop: this.dataSource.length > 10 ? this.dataSource.length * 50 : 0,
						duration: 0
					});
				})
			},
			handDel(item) { // 删除
				this.uModalTart = item
				this.uModalShow = true
			},
			// 确定框 确定
			async uModalCom() {
				let Arr = this.dataSource.findIndex((item, index) => {
					if (index == this.uModalTart) {
						return true
					}
				})
				this.dataSource.splice(Arr, 1)
				this.onNotify({})
				this.uModalCle()
				if (this.dataSource.length == 0) this.stagingShow = true
			},
			// 取消删除
			uModalCle() {
				this.uModalTart = 0
				this.uModalShow = false
			},
			async loadData(index) {
				if (index == 1) return this.$emit('onIndex', []);
				// 获取缺失项的索引和字段
				const missingItems = this.missingItemIndexes();
				// 如果有缺失项，则进行处理
				if (missingItems.length > 0) {
					this.verify = true;
					if (missingItems[0].index == 0) {
						uni.pageScrollTo({
							scrollTop: 0,
							duration: 0
						});
					}
					return this.onNotify({
						type: 'error',
						message: '红色*为必填选项，请完善信息',
					});
				}
				if (this.stagingShow && this.stagingMode.applicateCardMethod) {
					this.$refs.valiForm.validate().then(res => {
						console.log(res)
						if (!this.stagingMode.cardName) return this.onNotify({
							type: 'error',
							message: `请输入${this.dataSource.length+1}条的信用卡欠款银行名称`,
						});

						if (!this.stagingMode.cardBar) return this.onNotify({
							type: 'error',
							message: `请输入${this.dataSource.length+1}条的信用卡卡号`,
						});
						if (!this.stagingMode.totalDebt) return this.onNotify({
							type: 'error',
							message: `请输入${this.dataSource.length+1}条的信用卡包含利息总欠款`,
						});

						if (!this.stagingMode.carLimit) return this.onNotify({
							type: 'error',
							message: `请输入${this.dataSource.length+1}条的目前额度`,
						});

						if (!this.stagingMode.reservedBankInitPhone) return this.onNotify({
							type: 'error',
							message: `请输入${this.dataSource.length+1}条的银行初始预留手机号`,
						});
						if (!this.stagingMode.repaymentBindingBank) return this.onNotify({
							type: 'error',
							message: `请输入${this.dataSource.length+1}条的还款储蓄卡绑定哪家银行`,
						});

						if (!this.stagingMode.repaymentBindingBankCard) return this.onNotify({
							type: 'error',
							message: `请输入${this.dataSource.length+1}条的完整银行卡号`,
						});

						if (!this.stagingMode.repaymentDate) return this.onNotify({
							type: 'error',
							message: `请输入${this.dataSource.length+1}条的还款日`,
						});

						if (!this.stagingMode.planRepaymentCycle) return this.onNotify({
							type: 'error',
							message: `请输入${this.dataSource.length+1}条的打算多久结清欠款或计划每个月拿出多少自己去偿还此笔款项`,
						});
						if (!this.stagingMode.expectedRealReasons) return this.onNotify({
							type: 'error',
							message: `请输入${this.dataSource.length+1}条的逾期真实原因`,
						});
						let obj = {
							...this.stagingMode
						}
						this.dataSource.push(obj);
						this.stagingMode = {}
						this.stagingShow = false
						// 如果没有缺失项，继续处理数据
						this.$emit('onIndex', this.dataSource)
					}).catch(err => {
						console.log(err)
						this.onNotify({
							type: 'error',
							message: err[0].errorMessage,
						});
						uni.pageScrollTo({
							scrollTop: this.dataSource.length > 10 ? this.dataSource.length * 50 : 0,
							duration: 0
						});
					})

				} else this.$emit('onIndex', this.dataSource)

			},
			missingItemIndexes() {
				const fieldsToCheck = [
					'repaymentBindingBankCard', 'planRepaymentCycle', 'expectedRealReasons', 'cardName',
					'applicateCardMethod', 'cardBar', 'totalDebt', 'carLimit',
					'applicateCardEmail', 'reservedBankInitPhone', 'repaymentBindingBank'
				];
				const missingItems = []; // 用于存储缺少字段的项
				// 遍历 dataSource 数组
				const arr = this.dataSource.filter(item => !item.id);
				arr.forEach((item, index) => {
					// 用于存储空字段的名称
					const emptyFields = fieldsToCheck.filter(field =>
						!item[field] || (typeof item[field] === 'string' && item[field].trim() === '')
					);
					if (emptyFields.length > 0) {
						// 存储缺少字段的项
						missingItems.push({
							index: index,
							emptyFields: emptyFields
						});
					}
				});

				return missingItems; // 返回所有缺少字段的项
			},
			onNotify(round) {
				this.$refs.uNotify.show({
					type: round.type ? round.type : 'success',
					message: round.message ? round.message : '删除成功',
				})
			},
			handCheck(index, indx) { // 调用日期
				console.log(index)
				if (this.indexCardInfo > indx) return
				this.model = {
					indexCheck: index,
					index: indx
				}
				this.$refs.calendar.open();
			},
			ConfirmCheck(e) { // 选择完日期返回过的值
				if (this.model.indexCheck == 1) this.$set(this.dataSource[this.model.index], 'billingDate', e
					.fulldate);
				if (this.model.indexCheck == 2) this.$set(this.dataSource[this.model.index], 'repaymentDate', e
					.fulldate);
				if (this.model.indexCheck == 3) this.$set(this.dataSource[this.model.index], 'currentRepaymentDate', e
					.fulldate);
				if (this.model.indexCheck == 4) this.$set(this.dataSource[this.model.index], 'overdueTime', e
					.fulldate);
			},
			handStaging(index) {
				this.model = {
					indexCheck: index
				}
				this.$refs.refStaging.open();
			},
			ConfirmStaging(e) {
				if (this.model.indexCheck == 1) this.$set(this.stagingMode, 'billingDate', e
					.fulldate);
				if (this.model.indexCheck == 2) this.$set(this.stagingMode, 'repaymentDate', e
					.fulldate);
				if (this.model.indexCheck == 3) this.$set(this.stagingMode, 'currentRepaymentDate', e
					.fulldate);
				if (this.model.indexCheck == 4) this.$set(this.stagingMode, 'overdueTime', e
					.fulldate);
			},
			handeLaststep() { // 上一步
				this.$emit('onLast', 0)
			},
			handleBlur(){
				if(!this.stagingMode.repaymentBindingBankCard) this.$set(this.stagingMode,
					'repaymentBindingBankCard',this.stagingMode.cardBar)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.pagesss {
		::v-deep .is-disabled {
			background-color: #ffffff !important;
			color: #0d0d0d !important;
			pointer-events: none
		}
	}
</style>
<style>
	.box .u-cell__body.data-v-1c4434ae {
		padding: 20rpx 10rpx !important;
		font-size: 24rpx !important;
		/* border-bottom: 1px #eee solid; */
	}

	.box .padding.padding-bottom-sm.data-v-1fe345ab {
		padding: 0px !important
	}
</style>